<!-- 模板 -->
<template>
  <!-- 评论页 -->
  <div class="evaluate">
    <div class="item" v-for="(item, index) in evaluete" :key="index" @click="Dialog(item.id)">
      <div class="data">
        <div class="toux"><img :src="item.src" /></div>
        <div class="tname">
          <div class="uname">{{ item.title }}</div>
          <div class="time" v-if="getBeforeDate(item.itm) > 0">{{ getBeforeDate(item.itm) }}天前</div>
          <div class="time" v-else>今天</div>
        </div>
        <div class="rate">
          <i v-for="i in parseInt(item.stars)" :key="i" class="iconfont icon-star"></i>
        </div>
      </div>
      <div class="des">{{ item.h3 }}</div>
    </div>
    <div class="fabiao iconfont icon-fabiao" @click="toComp('/addEval')"></div>
  </div>
</template>
<script>
import request from '../utils/request.js'
import { Dialog } from 'vant'
export default {
  name: '',
  data() {
    return {
      evaluete: [],
    }
  },
  props: [],
  components: {},
  computed: {},
  filters: {},
  methods: {
    toComp(path) {
      this.$router.push(path)
    },
    //获取传入的时间转化成天数
    getBeforeDate(n) {
      let now = new Date()
      let aftertime = new Date(n)
      let year = now.getFullYear()
      let mon = now.getMonth() + 1
      let day = now.getDate()
      let year_after = aftertime.getFullYear()
      let mon_after = aftertime.getMonth() + 1
      let day_after = aftertime.getDate()
      let chs = 0
      //获取当月的天数
      function DayNumOfMonth(Year, Month) {
        return 32 - new Date(Year, Month - 1, 32).getDate()
      }
      if (aftertime.getTime() - now.getTime() < 0) {
        let temp1 = day_after
        let temp2 = mon_after
        let temp3 = year_after
        day_after = day
        mon_after = mon
        year_after = year
        day = temp1
        mon = temp2
        year = temp3
      }
      if (year == year_after) {
        //不跨年
        if (mon == mon_after) {
          //不跨年不跨月
          chs += day_after - day
        } else {
          //不跨年跨月
          chs += DayNumOfMonth(year, mon) - day + 1 //加上第一个不满的
          for (let i = 1; i < mon_after - mon; i++) {
            chs += DayNumOfMonth(year, mon + i)
          }
          chs += day_after - 1 //加上
        }
      } else {
        //存在跨年
        chs += DayNumOfMonth(year, mon) - day + 1 //加上开始年份不满的一个月
        for (let m = 1; m < 12 - mon; m++) {
          chs += DayNumOfMonth(year, mon + m)
        }
        for (var j = 1; j < year_after - year; j++) {
          if ((year + j) % 400 == 0 || ((year + j) % 4 == 0 && (year + j) % 100 != 0)) {
            chs += 366
          } else {
            chs += 365
          }
        }
        for (let n = 1; n <= mon_after; n++) {
          chs += DayNumOfMonth(year_after, n)
        }
        chs += day_after - 1
      }
      if (aftertime.getTime() - now.getTime() > 0) {
        return -chs
      } else {
        return chs
      }
    },
    //删除评论弹框
    Dialog(id) {
      Dialog.confirm({
        title: '提示',
        message: '确定要删除此评论吗?',
      })
        .then(() => {
          this.deletePl(id)
        })
        .catch(() => {
          return
        })
    },
    //传值给父组件,用于判断当前tab激活位置
    outPut() {
      this.$emit('index1', 2)
    },
    //请求删除评论
    async deletePl(id) {
      let options = {
        url: '/deletepl',
        type: 'post',
        data: { id: id },
      }
      try {
        let { data: res } = await request(options)
        if (res.meta.status !== 200) {
          console.log(res.meta.msg)
        }
        this.getUser()
      } catch (err) {
        console.log(err)
      }
    },
    //请求评论数据
    async getUser() {
      let options = {
        url: '/content',
        type: 'get',
        data: { id: 2 },
      }
      try {
        let { data: res } = await request(options)
        if (res.meta.status !== 200) {
          console.log(res.meta.msg)
        }
        this.evaluete = res.data
      } catch (err) {
        console.log(err)
      }
    },
  },
  created() {},
  mounted() {
    this.getUser(), this.outPut()
  },
  beforeRouteEnter(to, from, next) {
    next()
  },
  beforeRouteLeave(to, from, next) {
    next()
  },
  beforeRouteUpdate(to, from, next) {
    next()
  },
}
</script>
<style lang="less" scoped>
// @import url(); 引入公共css类
.evaluate {
  padding: 0 0.2rem;
  .item {
    padding: 0.05rem 0;
    border-bottom: 1px solid #f5f5f5;
    width: 100%;
    .data {
      display: flex;
      .toux {
        width: 0.8rem;
        height: 0.8rem;
        border-radius: 50%;
        overflow: hidden;
        img {
          width: 100%;
        }
      }
      .tname {
        margin-left: 0.2rem;
        width: 50%;
        .uname {
        }
        .time {
          font-size: 0.24rem;
          color: #666;
        }
      }
      .rate {
        align-self: center;
        width: 40%;
        text-align: right;
        color: #ffb62c;
      }
    }
    .des {
      color: #999;
      line-height: 1.8;
    }
  }
  .fabiao {
    background-color: #fff;
    border: 1px solid #ccc;
    position: fixed;
    bottom: 0.5rem;
    padding: 0.2rem;
    right: 0.5rem;
    font-size: 0.4rem;
  }
}
</style>
